<template>
	<view class="pagebody">
		<view class="topbox borderbox">
			<NavHeader :type="1"></NavHeader>
		</view>
		<view class="formbox ">
			<view class="formboxtitle">
				<span></span>
				{{userDocument.diseaseName}}知识库
			</view>
			<view class="justify-between">
				<view class="jbzs" @click="toJBZS()">
					<view class="font_div">
						疾病知识
					</view>
					<view class="font_ms">
						疾病信息  一目了然
					</view>
					<view class="font_ck">
						点击查看
					</view>
				</view>
				<view class="right_box" style="margin-right: 24rpx;">
					<view class="jbzn" @click="toJBZN()">
						<view class="font_div">疾病指南</view>
						<view class="font_ms">
							预防疾病 指南先行
						</view>
					</view>
					<view class="xgyp" @click="toXGYP()">
						<view class="font_div">相关药品</view>
						<view class="font_ms">
							精准用药 健康每刻
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bot_div ">
			<view class="bot_box flex-row" >
				<image class="img_div" src="@/static/images/zsk/zbkp.png"></image>
				<view class="img_font">
					<view class="title">直播科普 </view>
					<view class="content">科普直播  知识共享 </view>
				</view>
				<view class="btn_div" @click="toZBKP()">点击查看</view>
			</view>
			<view class="bot_box flex-row" >
				<image class="img_div" src="@/static/images/zsk/lczm.png"></image>
				<view class="img_font">
					<view class="title">临床招募 </view>
					<view class="content">试验新药  希望新起点 </view>
				</view>
				<view class="btn_div" @click="toLCZM()">点击查看</view>
			</view>
			<view class="bot_box flex-row" >
				<image class="img_div" src="@/static/images/zsk/zyhd.png"></image>
				<view class="img_font">
					<view class="title">赠药活动 </view>
					<view class="content">公益赠药  传递温情 </view>
				</view>
				<view class="btn_div" @click="toZYHD()">点击查看</view>
			</view>
		</view>

		
		

		<FixedFoot :typeid="2"></FixedFoot>
	</view>
</template>
	

<script>
	
	import FixedFoot from '../../layouts/fixedfoot.vue';
	import NavHeader from '../../layouts/navheader.vue';
	import {
		getInfo
	} from '@/api/login'
	import {
		getMaxLiveBroadcast
	} from '@/api/api.js'
	export default {
		components: {
			FixedFoot,
			NavHeader
		},
		onLoad() {
			this.getuser()
			// this.getMaxLiveBroadcast()
		},
		data() {
			return {
				user:{},
				userDocument:{},
				liveBroadcast:{}
			}
		},
		methods: {
			
			getMaxLiveBroadcast() {
				getMaxLiveBroadcast().then(res => {
					this.liveBroadcast = res.data
				})
			},
			getuser() {
				getInfo().then(res => {
					this.user = res.user
					this.userDocument = res.userDocument
				})
			},
			//疾病知识
			toJBZS(){
				uni.navigateTo({
					url:'/pages/knowledge/detail?id='+this.userDocument.diseaseId
				})
			},
			//疾病指南
			toJBZN(){
				uni.navigateTo({
					url:'/pages/knowledge/diseaseGuide?id='+this.userDocument.diseaseId
				})
			},
			//相关药品
			toXGYP(){
				uni.navigateTo({
					url:'/pages/knowledge/druglist?id='+this.userDocument.diseaseId
				})
			},
			//直播科普
			toZBKP(){
				uni.navigateTo({
					url:'/pages/broadcast/broadcastList'
				})
			},
			//临床招募
			toLCZM(){
				uni.navigateTo({
					url:'/pages/knowledge/diseaseClinical?id='+this.userDocument.diseaseId
				})
			},
			//赠药活动
			toZYHD(){
				uni.navigateTo({
					url:'/pages/knowledge/giftdrugnews?id='+this.userDocument.diseaseId
				})
			},
		},
		created() {},
	}
</script>

<style lang="scss" scoped>


	.pagebody {
		padding-bottom: 136rpx;
		.topbox {
			height: 874rpx;
			padding: 36rpx 24rpx;
			background-image: url('/static/images/zsk/zsk_back.png');
			background-size: cover;        /* 背景图像覆盖整个容器，可能裁剪 */
			
		}

		.formbox {
			margin-top: -470rpx;
			.formboxtitle{
				padding: 0 25rpx;
				margin-bottom: 34rpx;
				display: flex;
				justify-content: start;
				align-items: center;
				color: #303B39;
				font-size: 36rpx;
				font-weight: bold;
				span{
					width: 8rpx;
					height: 40rpx;
					background: #00D9B2;
					border-radius: 8rpx;
					margin-right: 10rpx;
				}
			}
			.jbzs{
				width: 328rpx;
				height: 380rpx;
				background-image: url('/static/images/zsk/jbzs.png');
				background-size: cover;       
				border-radius: 24rpx;
				margin-left: 24rpx;
				padding: 31rpx 24rpx;
				
			}
			.font_div{
				width: 145rpx;
				height: 50rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 800;
				font-size: 36rpx;
				color: #00977C;
				line-height: 42rpx;
				text-align: center;
				font-style: normal;
				text-transform: none;
			}
			.font_ms{
				width: 238rpx;
				height: 39rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #576260;
				line-height: 33rpx;
				text-align: left;
				font-style: normal;
				text-transform: none;
			}
			.font_ck{
				width: 170rpx;
				height: 55rpx;
				background: linear-gradient( 140deg, #4EF2C9 0%, #00D9B2 100%);
				box-shadow: 0rpx 2rpx 5rpx 0rpx rgba(0,217,178,0.1), inset 0rpx 2rpx 6rpx 0rpx rgba(253,233,244,0.5);
				border-radius: 55rpx 55rpx 55rpx 55rpx;
				font-weight: 800;
				font-size: 25rpx;
				color: #FFFFFF;
				line-height: 55rpx;
				text-shadow: 0rpx 0rpx 2rpx #00BA99;
				text-align: center;
				margin-top: 12rpx;
					
			}
			.jbzn{
				width: 358rpx;
				height: 182rpx;
				background-image: url('/static/images/zsk/jbzn.png');
				background-size: cover;       
				border-radius: 24rpx;
				padding: 31rpx 24rpx;
			}
			
			.xgyp{
				width: 358rpx;
				height: 182rpx;
				background-image: url('/static/images/zsk/xgyp.png');
				background-size: cover;       
				border-radius: 24rpx;
				margin-top: 16rpx;
				padding: 31rpx 24rpx;
			}
		}
		.bot_div{
			width: 702rpx;
			height: 676rpx;
			padding: 32rpx 24rpx;
			.bot_box{
				width: 702rpx;
				height: 148rpx;
				border-radius: 32rpx;
				background: #FFFFFF;
				padding: 32rpx 24rpx;
				margin-top: 16rpx;
				.img_div{
					width: 84rpx;
					height: 84rpx;
				}
				.img_font{
					width: 238rpx;
					height: 68rpx;
					margin-left: 8rpx;
					padding: 8px;
					.title{
						width: 238rpx;
						height: 32rpx;
						font-weight: bold;
						font-size: 32rpx;
						line-height: 32rpx;
						text-align: left;
					}
					.content{
						width: 238rpx;
						height: 24rpx;
						font-weight: 500;
						font-size: 24rpx;
						color: #576260;
						line-height: 24rpx;
						text-align: left;
						margin-top: 12rpx;
					}
				}
				.btn_div{
					width: 166rpx;
					height: 54rpx;
					background: #E5FBF7;
					border-radius: 55rpx;
					font-weight: 800;
					font-size: 24rpx;
					color: #00D9B2;
					line-height: 54rpx;
					text-align: center;
					margin: 20rpx 0 0 150rpx;
				}
			}
		}
	
		
	}
</style>